<template>
  <div class="flex flex-col h-full">
    <a-card>
      <SearchContainer @reset="() => formRef.resetFields()" @search="getData">
        <a-form ref="formRef" class="form-style-flex" :model="formState">
          <a-form-item name="categoryCode" label="" class="w-80">
            <a-select v-model:value="formState.categoryCode" placeholder="请选择" class="w-40" @change="onChange">
              <a-select-option v-for="item in categoryList" :key="item" :value="item.categoryCode">{{ item.categoryName }}</a-select-option>
            </a-select>
          </a-form-item>
          <a-form-item label="模板" name="searchWord" class="ml-4">
            <a-input v-model:value="formState.searchWord" class="w-80" allow-clear placeholder="分类名称/模板名称/助记码" />
          </a-form-item>
        </a-form>
      </SearchContainer>
    </a-card>
    <div class="flex flex-1 justify-between mt-2">
      <TemplateMenu ref="templateMenu" @select="onSelect" />
      <a-card class="ml-2 flex-1" :body-style="{ height: '100%', display: 'flex', flexDirection: 'column' }">
        <div class="flex flex-col overflow-auto h-full">
          <div class="flex-1">
            <a-form ref="formSRef" class="form-style-flex" :model="form">
              <div class="w-full flex justify-between">
                <a-form-item label="模板名称" name="tpName" class="w-1/3 mr-8">
                  <a-input v-model:value="form.tpName" placeholder="请输入模板名称" @blur="getZjm(form.tpName)" />
                </a-form-item>
                <a-form-item label="助记码" name="zjm">
                  <a-input v-model:value="form.zjm" placeholder="请输入助记码" />
                </a-form-item>
                <a-form-item label="适用性别" name="xb">
                  <a-radio-group v-model:value="form.xb">
                    <a-radio value="">不限</a-radio>
                    <a-radio value="男">男</a-radio>
                    <a-radio value="女">女</a-radio>
                  </a-radio-group>
                </a-form-item>
              </div>
              <a-form-item name="content1" label="检查方法" class="w-full">
                <a-textarea v-model:value="form.content1" :rows="2" placeholder="请输入检查方法" />
              </a-form-item>
              <a-form-item name="content2" label="检查所见" class="w-full">
                <a-textarea v-model:value="form.content2" :rows="6" placeholder="请输入检查所见" />
              </a-form-item>
              <a-form-item name="content3" label="诊断意见" class="w-full">
                <a-textarea v-model:value="form.content3" :rows="6" placeholder="请输入诊断意见" />
              </a-form-item>
            </a-form>
          </div>
          <div class="flex justify-end mt-2">
            <a-button @click="onReset">重置</a-button>
            <a-button type="primary" class="ml-2" @click="onSaveTemplate">保存</a-button>
          </div>
        </div>
      </a-card>
    </div>
  </div>
</template>

<script setup>
import { onMounted, ref } from 'vue'
import { message } from 'ant-design-vue'
import { post } from '@/utils/request'
import TemplateMenu from './components/TemplateMenu'
import useStore from './store'

const store = useStore()
const formRef = ref(null)
const formSRef = ref(null)
const templateMenu = ref(null)
const formState = ref({ categoryCode: undefined, searchWord: '' })
const categoryList = ref([])
const form = ref({ xb: '' })
const selectItem = ref({})

const getData = () => {
  templateMenu.value?.getData(formState.value)
  form.value = {
    xb: ''
  }
}
const onChange = (val) => {
  store.categoryCode = val
  getData()
}
const geCategoryList = async () => {
  const { data, code } = await post('/ris/dictCategory/getDictCategoryListByEmp', {})
  if (code === 0) {
    categoryList.value = data || []
    if (categoryList.value.length > 0) {
      if (store.categoryCode) {
        formState.value.categoryCode = store.categoryCode
      } else {
        formState.value.categoryCode = categoryList.value[0].categoryCode
      }
      getData()
    }
  }
}
const getZjm = async (e) => {
  if (!e) return
  const { data, code, msg } = await post('/common/util/getPinyin', {
    name: e
  })
  if (code !== 0) return message.error(msg)
  form.value.zjm = data
}
const getTemplateContent = async () => {
  const { msg, data, code } = await post('/ris/template/getRisTemplateContent', {
    data: selectItem.value.code
  })
  if (code !== 0) return message.error(msg)
  form.value = data
}
const onSaveTemplate = async () => {
  const { msg, code } = await post('/ris/template/doSaveRisTemplateContent', {
    ...form.value,
    tpCategoryCode: selectItem.value.code
  })
  if (code !== 0) return message.error(msg)
  message.success(msg || '保存成功')
  templateMenu.value?.getData(formState.value)
}
const onSelect = (val) => {
  selectItem.value = val
  if (selectItem.value.nodeType === 0) {
    getTemplateContent()
  } else {
    form.value = {
      xb: ''
    }
  }
}
const onReset = () => {
  if (selectItem.value.nodeType === 0) {
    getTemplateContent()
  } else {
    form.value = {
      xb: ''
    }
  }
}

onMounted(async () => {
  await geCategoryList()
})
</script>

<style scoped></style>
